import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:ball_lion/module/match/detail/lq_match_data_logic.dart';
import 'package:ball_lion/entity/match/detail/lq_match_data_entity.dart';
import 'package:ball_lion/resources/colours.dart';
import 'package:ball_lion/resources/styles.dart';
import 'package:ball_lion/utils/date_time_utils.dart';
import 'package:ball_lion/utils/mode_config.dart';
import 'package:ball_lion/routes/routes.dart';
import 'package:ball_lion/utils/utils.dart';
import 'package:ball_lion/utils/widget_utils.dart';
import 'package:ball_lion/widgets/bottom_picker_widget.dart';
import 'package:ball_lion/widgets/loading/loading_widget.dart';
import 'package:ball_lion/widgets/base/wqs_button.dart';
import 'package:ball_lion/widgets/ladder_tab_bar.dart';
import 'package:ball_lion/widgets/loading/no_data_widget.dart';

import 'package:ball_lion/widgets/base/wqs_text.dart';
import 'package:ball_lion/widgets/ads_label.dart';

class LqDetailDataView extends StatefulWidget {
  const LqDetailDataView({super.key, this.matchId});

  final int? matchId;

  @override
  State<LqDetailDataView> createState() => _LqDetailDataViewState();
}

class _LqDetailDataViewState extends State<LqDetailDataView> {
  late final LqMatchDataLogic logic;

  bool expanded = false;

  @override
  void initState() {
    logic = Get.put(LqMatchDataLogic(), tag: '${widget.matchId}');
    logic.matchId = widget.matchId;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<LqMatchDataLogic>(
        tag: '${widget.matchId}',
        builder: (_) => LoadingWidget<bool>(
              isLoading: logic.firstInit,
              data: logic.isCompareEmpty(),
              child: () => ListView(
                children: [
                  const AdsLabel(
                    adsTag: "match_lq_数据",
                    tapType: 'ggw_bsxq_data',
                    margin: EdgeInsets.fromLTRB(8, 8, 8, 0),
                  ),
                  if (!logic.teamCompareEmpty() ||
                      !logic.teamAvgCompareEmpty()) ...[
                    const SizedBox(height: 8),
                    duibi(),
                  ],
                  if (logic.data?.vsHistory.hasValue == true)
                    Styles.card(
                        margin:
                            const EdgeInsets.only(left: 8, right: 8, top: 8),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            titleWidget('两队交锋', 'match_data_jiaofeng.png'),
                            jiaofeng(0),
                          ],
                        )),
                  if (logic.data?.homeHistory.hasValue == true ||
                      logic.data?.awayHistory.hasValue == true)
                    Styles.card(
                        margin:
                            const EdgeInsets.only(left: 8, right: 8, top: 8),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            titleWidget('近期战绩', 'match_data_recent.png'),
                            if (logic.data?.homeHistory.hasValue == true)
                              jiaofeng(1),
                            if (logic.data?.awayHistory.hasValue == true)
                              jiaofeng(2),
                          ],
                        )),
                  if (logic.data?.homeFuture.hasValue == true ||
                      logic.data?.awayFuture.hasValue == true)
                    Styles.card(
                        margin:
                            const EdgeInsets.only(left: 8, right: 8, top: 8),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            titleWidget('近期比赛', 'match_data_future.png'),
                            if (logic.data?.homeFuture.hasValue == true)
                              jinqizhanji(0),
                            if (logic.data?.awayFuture.hasValue == true)
                              jinqizhanji(1),
                          ],
                        )),
                  const SizedBox(height: 50)
                ],
              ),
            ));
  }

  //球队对比
  Widget duibi() {
    return GetBuilder<LqMatchDataLogic>(
        tag: '${widget.matchId}',
        builder: (_) {
          return Styles.card(
            margin: const EdgeInsets.symmetric(horizontal: 8),
            color: Colours.transparent,
            child: Column(
              children: [
                LadderTabBar(
                    tabs: const [QsText('球队对比'), QsText('场均对比')],
                    selectLabelStyle: TabStyle(color: Colours.main),
                    onTap: (value) => logic.duibiTabIndex = value),
                Container(
                  decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                          topLeft:
                              Radius.circular(logic.duibiTabIndex == 0 ? 0 : 8),
                          topRight: Radius.circular(
                              logic.duibiTabIndex == 1 ? 0 : 8))),
                  child: Column(children: [
                    Row(
                      children: [
                        Container(
                          padding: const EdgeInsets.symmetric(
                              horizontal: 12, vertical: 10),
                          child: Row(children: [
                            CachedNetworkImage(
                              imageUrl:
                                  logic.teamData?.awayInfo?.teamLogo ?? '',
                              width: 32,
                            ),
                            const SizedBox(width: 2),
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                QsText(
                                    logic.teamData?.awayInfo?.teamName ?? ''),
                                QsText(
                                    '${logic.teamData?.awayInfo?.record ?? ''} ${logic.teamData?.awayInfo?.recentRecord ?? ''}',
                                    color: Colours.grey99,
                                    fontSize: 12)
                              ],
                            )
                          ]),
                        ),
                        const Spacer(),
                        Container(
                          padding: const EdgeInsets.symmetric(
                              horizontal: 12, vertical: 10),
                          child: Row(children: [
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.end,
                              children: [
                                QsText(
                                  logic.teamData?.homeInfo?.teamName ?? '',
                                ),
                                QsText(
                                  '${logic.teamData?.homeInfo?.recentRecord ?? ''} ${logic.teamData?.homeInfo?.record ?? ''}',
                                  color: Colours.grey99,
                                  fontSize: 12,
                                )
                              ],
                            ),
                            const SizedBox(width: 2),
                            CachedNetworkImage(
                              imageUrl:
                                  logic.teamData?.homeInfo?.teamLogo ?? '',
                              width: 32,
                            ),
                          ]),
                        ),
                      ],
                    ),
                    if (logic.duibiTabIndex == 0)
                      teamCompare()
                    else
                      avgCompare(),
                  ]),
                )
              ],
            ),
          );
        });
  }

  Widget teamCompare() {
    List<List> data = logic.getTeamCompareData();
    int length = (data.length > 5 && !expanded) ? 5 : data.length;
    return logic.teamCompareEmpty(includeRecent: false)
        ? Container(
            color: Colors.white,
            child: const NoDataWidget(
              needPic: false,
            )).paddingOnly(bottom: 18)
        : AnimatedSize(
            duration: const Duration(milliseconds: 300),
            alignment: Alignment.topCenter,
            child: Container(
              color: Colours.white,
              padding: const EdgeInsets.fromLTRB(12, 10, 12, 16),
              child: Column(children: [
                ...List.generate(length, (index) {
                  return compareCell(data[index][0],
                      leftNum: data[index][1], rightNum: data[index][2]);
                }),
                if (data.length > 5) ...[
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      expanded = !expanded;
                      update();
                    },
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        QsText(expanded ? '收起数据' : "更多数据",
                            color: Colours.main, fontSize: 12),
                        Icon(
                          expanded
                              ? Icons.keyboard_arrow_up_rounded
                              : Icons.keyboard_arrow_down_rounded,
                          size: 18,
                          color: Colours.main,
                        )
                      ],
                    ),
                  )
                ]
              ]),
            ),
          );
  }

  Widget avgCompare() {
    List<List> data = logic.getTeamAvgCompareData();
    // if (data.length == 0) {
    //   return Container();
    // }

    int length = (data.length > 5 && !expanded) ? 5 : data.length;
    return logic.teamAvgCompareEmpty()
        ? Container(
                color: Colours.white, child: const NoDataWidget(needPic: false))
            .paddingOnly(bottom: 18)
        : AnimatedSize(
            duration: const Duration(milliseconds: 300),
            alignment: Alignment.topCenter,
            child: Container(
              color: Colours.white,
              padding: const EdgeInsets.fromLTRB(12, 10, 12, 16),
              child: Column(children: [
                ...List.generate(length, (index) {
                  return compareCell(data[index][0],
                      leftNum: data[index][1], rightNum: data[index][2]);
                }),
                if (data.length > 5) ...[
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      expanded = !expanded;
                      update();
                    },
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        QsText(
                          expanded ? '收起数据' : "更多数据",
                          color: Colours.main,
                          fontSize: 12,
                        ),
                        Icon(
                          expanded
                              ? Icons.keyboard_arrow_up_rounded
                              : Icons.keyboard_arrow_down_rounded,
                          size: 18,
                          color: Colours.main,
                        )
                      ],
                    ),
                  )
                ]
              ]),
            ),
          );
  }

  Widget compareCell(String name,
      {String leftNum = '0', String rightNum = '0'}) {
    double left = double.parse(leftNum);
    double right = double.parse(rightNum);
    bool leftWin = left > right;
    String leftStr = '$left';
    String rightStr = '$right';
    if (name == '胜率' || name == '近10场' || name == '主场' || name == '客场') {
      leftStr += '%';
      rightStr += '%';
    }
    double width = (Get.width - 32) / 2 - 8;
    return Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        const SizedBox(height: 6),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            QsText(
              leftStr,
              color: left >= right ? Colours.text : Colours.grey99,
              fontFamily: "Din",
              fontSize: 16,
            ),
            QsText(
              name,
              fontSize: 12,
            ),
            QsText(
              rightStr,
              color: left > right ? Colours.grey99 : Colours.text,
              fontFamily: "Din",
              fontSize: 16,
            )
          ],
        ),
        const SizedBox(height: 6),
        Stack(
          children: [
            Container(
              height: 6,
              decoration: const BoxDecoration(
                  color: Colours.greyF7,
                  borderRadius: BorderRadius.all(Radius.circular(2))),
            ),
            Positioned(
              left: 0,
              right: width,
              child: Row(children: [
                const Spacer(),
                Container(
                  height: 6,
                  width: (left == 0 && right == 0 ? 0 : left / (left + right)) *
                      width,
                  decoration: BoxDecoration(
                      color:
                          left >= right ? Colours.blue2766D6 : Colours.greyD7,
                      borderRadius: const BorderRadius.only(
                          topLeft: Radius.circular(2),
                          bottomLeft: Radius.circular(2))),
                )
              ]),
            ),
            Positioned(
              left: width,
              right: 0,
              child: Row(children: [
                Container(
                  height: 6,
                  width:
                      (left == 0 && right == 0 ? 0 : right / (left + right)) *
                          width,
                  decoration: BoxDecoration(
                      color: left > right ? Colours.greyD7 : Colours.main,
                      borderRadius: const BorderRadius.only(
                          topRight: Radius.circular(2),
                          bottomRight: Radius.circular(2))),
                ),
                const Spacer()
              ]),
            )
          ],
        ),
        const SizedBox(height: 6),
      ],
    );
  }

  ///两队比赛数据表
  ///0 交锋
  ///1 主队战绩
  ///2 客队战绩
  Widget jiaofeng(int type) {
    // final title = type == 0 ? '两队交锋' : '近期战绩';
    bool sameHome = false;
    bool sameLeague = false;
    List<VsList> vsList = [];
    // int zhishuType = 0;
    int matchNumType = 0;
    if (type == 0) {
      vsList = logic.vsList ?? [];
      sameHome = logic.jiaofengSameHomeVs;
      sameLeague = logic.jiaofengsSameLeagueVs;
      // zhishuType = controller.vsType1;
      matchNumType = logic.jiaofengType2;
    } else if (type == 1) {
      vsList = logic.homeRecentVs ?? [];
      sameHome = logic.homeSameHomeRecent;
      sameLeague = logic.homeSameLeagueRecent;
      // zhishuType = controller.homeRecentType1;
      matchNumType = logic.homeRecentType2;
    } else {
      vsList = logic.guestRecentVs ?? [];
      sameHome = logic.guestSameHomeRecent;
      sameLeague = logic.guestSameLeagueRecent;
      // zhishuType = controller.guestRecentType1;
      matchNumType = logic.guestRecentType2;
    }
    // List goalAndLost = controller.getGoalAndLost(type);
    final tableTitle = [
      '日期/赛事',
      '客队',
      '比分',
      '主队',
      if (ModeConfig.matchDetailOdds) ...['让分', '总分'],
    ];
    // final type1 = [
    //   '初指',
    //   '终指',
    // ];
    final type2 = [
      '近6场',
      '近10场',
      '近20场',
    ];
    return Container(
      color: Colours.white,
      padding: const EdgeInsets.fromLTRB(12, 0, 12, 12),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // Visibility(
          //   visible: type != 2,
          //   child: QsText(title,
          //       style:
          //           const TextStyle(fontWeight: FontWeight.w500, fontSize: 16)),
          // ),
          // Visibility(
          //   visible: type != 2,
          //   child: const SizedBox(height: 15),
          // ),
          Visibility(
            visible: type != 0,
            child: Row(
              children: [
                CachedNetworkImage(
                  width: 21,
                  height: 21,
                  imageUrl: (type == 1
                          ? logic.data?.currentMatchInfo?.homeLogo
                          : logic.data?.currentMatchInfo?.awayLogo) ??
                      '',
                  placeholder: (context, url) => Styles.placeholderIcon(),
                  errorWidget: (context, url, error) => Image.asset(
                    Utils.getImgPath('lq_placeholder.png'),
                    width: 21,
                    height: 21,
                  ),
                ),
                const SizedBox(width: 8),
                QsText((type == 1
                        ? logic.data?.currentMatchInfo?.homeName
                        : logic.data?.currentMatchInfo?.awayName) ??
                    '')
              ],
            ),
          ),
          Visibility(visible: type != 0, child: const SizedBox(height: 10)),
          Row(
            children: [
              SizedBox(
                height: 22,
                width: 52,
                child: QsButton(
                  onPressed: () {
                    Utils.onEvent('lqbspd_lqbsxq',
                        params: {'lqbspd_lqbsxq': '8'});
                    if (type == 0) {
                      logic.jiaofengSameHomeVs = !logic.jiaofengSameHomeVs;
                    } else if (type == 1) {
                      logic.homeSameHomeRecent = !logic.homeSameHomeRecent;
                    } else {
                      logic.guestSameHomeRecent = !logic.guestSameHomeRecent;
                    }
                  },
                  text: '同主客',
                  textStyle: const TextStyle(
                      fontWeight: FontWeight.w400, fontSize: 12),
                  backgroundColor:
                      sameHome ? Colours.redFEECEC : Colours.greyF7,
                  foregroundColor: sameHome ? Colours.main : Colours.grey66,
                  borderSide: BorderSide(
                      color: sameHome ? Colours.main : Colours.transparent,
                      width: 0.5),
                  // radius: 6,
                ),
              ),
              const SizedBox(width: 10),
              SizedBox(
                height: 22,
                width: 52,
                child: QsButton(
                  onPressed: () {
                    Utils.onEvent('lqbspd_lqbsxq',
                        params: {'lqbspd_lqbsxq': '9'});
                    if (type == 0) {
                      logic.jiaofengsSameLeagueVs =
                          !logic.jiaofengsSameLeagueVs;
                    } else if (type == 1) {
                      logic.homeSameLeagueRecent = !logic.homeSameLeagueRecent;
                    } else {
                      logic.guestSameLeagueRecent =
                          !logic.guestSameLeagueRecent;
                    }
                  },
                  text: '同赛事',
                  textStyle: const TextStyle(
                      fontWeight: FontWeight.w400, fontSize: 12),
                  backgroundColor:
                      sameLeague ? Colours.redFEECEC : Colours.greyF7,
                  foregroundColor: sameLeague ? Colours.main : Colours.grey66,
                  borderSide: BorderSide(
                      color: sameLeague ? Colours.main : Colours.transparent,
                      width: 0.5),
                  // radius: 6,
                ),
              ),
              const Spacer(),
              const SizedBox(width: 10),
              SizedBox(
                  height: 22,
                  width: 65,
                  child: selectButtonWidget('${type2[matchNumType]}', () async {
                    var initialIndex = 0;
                    String? eventId;
                    if (type == 0) {
                      initialIndex = logic.jiaofengType2;
                    } else if (type == 1) {
                      initialIndex = logic.homeRecentType2;
                    } else {
                      initialIndex = logic.guestRecentType2;
                    }
                    final result = await Get.bottomSheet(BottomPickerWidget(
                      type2,
                      title: '选择场数',
                      initialIndex: initialIndex,
                    ));
                    if (result != null) {
                      if (result == 1) {
                        Utils.onEvent('lqbspd_lqbsxq',
                            params: {'lqbspd_lqbsxq': '6'});
                      } else if (result == 2) {
                        Utils.onEvent('lqbspd_lqbsxq',
                            params: {'lqbspd_lqbsxq': '7'});
                      }
                      logic.selectMatchNumType(type, result);
                    }
                  })),
            ],
          ),
          const SizedBox(height: 12),
          vsList.isEmpty
              ? Container(
                  alignment: Alignment.center,
                  padding: const EdgeInsets.symmetric(vertical: 50),
                  child: QsText('暂无近期记录', color: Colours.grey66),
                )
              : Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                  if (ModeConfig.matchDetailOdds) ...[
                    matchCount(type, vsList.length),
                    const SizedBox(height: 12)
                  ],
                  Table(
                    columnWidths: const {
                      0: FixedColumnWidth(80),
                      2: FixedColumnWidth(70),
                      4: FixedColumnWidth(35),
                      5: FixedColumnWidth(40),
                    },
                    border: const TableBorder(
                      horizontalInside:
                          BorderSide(color: Colours.greyEE, width: 0.5),
                    ),
                    children: [
                      TableRow(
                          // decoration:
                          //     const BoxDecoration(color: Colours.greyF5F7FA),
                          children: List.generate(tableTitle.length, (index) {
                        TextAlign align = TextAlign.center;
                        if (index == 0 || index == 3) {
                          align = TextAlign.left;
                        } else if (index == 1) {
                          align = TextAlign.right;
                        }
                        return TableCell(
                            child: Padding(
                          padding: index == 0
                              ? const EdgeInsets.fromLTRB(8, 6, 0, 6)
                              : const EdgeInsets.symmetric(vertical: 6),
                          child: QsText(tableTitle[index],
                              fontSize: 12, textAlign: align),
                        ));
                      })),
                      ...List.generate(vsList.length, (index) {
                        return TableRow(
                            children:
                                List.generate(tableTitle.length, (index1) {
                          VsList vs = vsList[index];
                          Widget widget;
                          if (index1 == 0) {
                            widget = Padding(
                              padding: const EdgeInsets.only(left: 8),
                              child: QsText(
                                '${DateTimeUtils.formatDateString(vs.matchTime!, 'yyyy').substring(2)}/${DateTimeUtils.formatDateString(vs.matchTime!, 'MM/dd')}\n${vs.leagueName}',
                                fontSize: 12,
                                maxLines: 2,
                                textAlign: TextAlign.left,
                              ),
                            );
                          } else if (index1 == 1) {
                            Color color = Colours.text;
                            if (type == 1 &&
                                logic.data?.currentMatchInfo?.homeQxbTeamId ==
                                    vs.awayQxbId) {
                            } else if (type == 2 &&
                                logic.data?.currentMatchInfo?.awayQxbTeamId ==
                                    vs.awayQxbId) {
                            } else {
                              color = Colours.grey66;
                            }
                            widget = QsText(vs.awayName!,
                                fontSize: 12,
                                color: color,
                                maxLines: 2,
                                textAlign: TextAlign.right);
                          } else if (index1 == 2) {
                            widget = Column(
                              children: [
                                QsText(
                                  '${vs.awayScore}-${vs.homeScore}',
                                  color: logic.getColor(vs.homeWin),
                                  fontWeight: FontWeight.w500,
                                ),
                                QsText(
                                    '(${vs.awayHalfScore}-${vs.homeHalfScore})',
                                    color: Colours.grey99,
                                    fontSize: 11)
                              ],
                            );
                          } else if (index1 == 3) {
                            Color color = Colours.text;
                            if (type == 1 &&
                                logic.data?.currentMatchInfo?.homeQxbTeamId ==
                                    vs.homeQxbId) {
                            } else if (type == 2 &&
                                logic.data?.currentMatchInfo?.awayQxbTeamId ==
                                    vs.homeQxbId) {
                            } else {
                              color = Colours.grey66;
                            }
                            widget = QsText(vs.homeName!,
                                fontSize: 12,
                                color: color,
                                maxLines: 2,
                                textAlign: TextAlign.left);
                          } else if (index1 == 4) {
                            widget = QsText(logic.getYpWin(vs, type),
                                color: logic.getYpColor(vs.ypStatus),
                                fontSize: 12,
                                fontFamily: 'Din',
                                textAlign: TextAlign.center);
                          } else {
                            widget = QsText(logic.getDxWin(vs, type),
                                color: logic.getDxColor(vs.dxStatus),
                                fontSize: 12,
                                fontFamily: 'Din',
                                textAlign: TextAlign.center);
                          }
                          return TableCell(
                              verticalAlignment:
                                  TableCellVerticalAlignment.middle,
                              child: Padding(
                                  padding:
                                      const EdgeInsets.symmetric(vertical: 6),
                                  child: GestureDetector(
                                      onTap: () {
                                        if (vs.matchQxbId != null &&
                                            vs.matchQxbId != 0) {
                                          Get.toNamed(Routes.lqMatchDetail,
                                              arguments: vs.matchQxbId,
                                              preventDuplicates: false);
                                        }
                                      },
                                      child: widget)));
                        })

                            // controller.vsList!.map((e) {
                            //   return TableCell(child: QsText(e));
                            // }).toList());
                            );
                      })
                    ],
                  ),
                ])
        ],
      ),
    );
  }

  //0主队 1客队
  Widget jinqizhanji(int type) {
    final title = [
      '日期/赛事',
      '主队',
      '',
      '客队',
      '相隔',
    ];
    List<RecentMatch> list = [];
    if (type == 0) {
      list = logic.data!.homeFuture ?? [];
    } else {
      list = logic.data!.awayFuture ?? [];
    }
    return Visibility(
      visible: list.isNotEmpty,
      child: Container(
        color: Colours.white,
        padding: const EdgeInsets.fromLTRB(12, 0, 12, 12),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                CachedNetworkImage(
                  width: 21,
                  height: 21,
                  imageUrl: (type == 0
                          ? logic.data?.currentMatchInfo?.homeLogo
                          : logic.data?.currentMatchInfo?.awayLogo) ??
                      '',
                  placeholder: (context, url) => Styles.placeholderIcon(),
                  errorWidget: (context, url, error) => Image.asset(
                    Utils.getImgPath('lq_placeholder.png'),
                    width: 21,
                    height: 21,
                  ),
                ),
                const SizedBox(width: 8),
                QsText(
                  (type == 0
                          ? logic.data?.currentMatchInfo?.homeName
                          : logic.data?.currentMatchInfo?.awayName) ??
                      '',
                )
              ],
            ),
            const SizedBox(height: 10),
            Table(
              columnWidths: const {
                0: FlexColumnWidth(1),
                1: FlexColumnWidth(1),
                2: FixedColumnWidth(40),
                3: FlexColumnWidth(1),
                4: FlexColumnWidth(1)
              },
              border: const TableBorder(
                horizontalInside: BorderSide(color: Colours.greyEE, width: 0.5),
              ),
              defaultVerticalAlignment: TableCellVerticalAlignment.middle,
              children: [
                TableRow(
                    children: List.generate(title.length, (index) {
                  TextAlign align = TextAlign.center;
                  if (index == 0 || index == 3) {
                    align = TextAlign.left;
                  } else if (index == 1) {
                    align = TextAlign.right;
                  }
                  return TableCell(
                      child: Padding(
                          padding: index == 0
                              ? const EdgeInsets.fromLTRB(8, 6, 0, 6)
                              : const EdgeInsets.symmetric(vertical: 6),
                          child: QsText(title[index],
                              fontSize: 12, textAlign: align)));
                })),
                ...List.generate(list.length, (index) {
                  return TableRow(
                      children: List.generate(5, (index1) {
                    RecentMatch vs = list[index];
                    Widget widget;
                    if (index1 == 0) {
                      widget = Padding(
                        padding: const EdgeInsets.only(left: 8),
                        child: QsText(
                          '${DateTimeUtils.formatDateString(vs.matchTime!, 'yyyy').substring(2)}/${DateTimeUtils.formatDateString(vs.matchTime!, 'MM/dd')}\n${vs.leagueName}',
                          fontSize: 12,
                          textAlign: TextAlign.left,
                        ),
                      );
                    } else if (index1 == 1) {
                      Color color = Colours.text;
                      if (type == 0 &&
                          logic.data?.currentMatchInfo?.homeQxbTeamId ==
                              vs.awayQxbId) {
                      } else if (type == 1 &&
                          logic.data?.currentMatchInfo?.awayQxbTeamId ==
                              vs.awayQxbId) {
                      } else {
                        color = Colours.grey66;
                      }
                      widget = QsText(vs.awayName!,
                          fontSize: 12,
                          color: color,
                          maxLines: 2,
                          textAlign: TextAlign.right);
                    } else if (index1 == 2) {
                      widget = QsText('vs',
                          fontSize: 12, textAlign: TextAlign.center);
                    } else if (index1 == 3) {
                      Color color = Colours.text;
                      if (type == 0 &&
                          logic.data?.currentMatchInfo?.homeQxbTeamId ==
                              vs.homeQxbId) {
                      } else if (type == 1 &&
                          logic.data?.currentMatchInfo?.awayQxbTeamId ==
                              vs.homeQxbId) {
                      } else {
                        color = Colours.grey66;
                      }
                      widget = QsText(vs.homeName!,
                          fontSize: 12,
                          color: color,
                          maxLines: 2,
                          textAlign: TextAlign.left);
                    } else {
                      widget = QsText('${vs.offsetDay}天',
                          fontSize: 12, textAlign: TextAlign.center);
                    }
                    return GestureDetector(
                      onTap: () {
                        if (vs.matchQxbId != null && vs.matchQxbId != 0) {
                          Get.toNamed(Routes.lqMatchDetail,
                              arguments: vs.matchQxbId,
                              preventDuplicates: false);
                        }
                      },
                      child: Padding(
                        padding: const EdgeInsets.symmetric(vertical: 4),
                        child: widget,
                      ),
                    );
                  }));
                }),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget selectButtonWidget(String title, Function f) {
    return TextButton(
        style: ButtonStyle(
          padding: MaterialStateProperty.all(EdgeInsets.zero),
          side: MaterialStateProperty.all<BorderSide>(
            const BorderSide(width: 0.5, color: Colours.grey66),
          ),
          shape: MaterialStateProperty.all<OutlinedBorder>(
            RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(12),
            ),
          ),
        ),
        onPressed: () => f(),
        child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
          QsText(
            title,
            fontSize: 12,
            color: Colours.grey66,
          ),
          const SizedBox(width: 4),
          Image.asset(
            Utils.getImgPath('down_arrow.png'),
            width: 8,
            height: 6,
          )
        ]));
  }

  Widget matchCount(int type, int length) {
    List winPercentage = logic.getOddsWinPercentage(type);
    List ahPercentage = logic.getYpPercentage(type);
    List sbPercentage = logic.getDxPercentage(type);
    List dlPercentage = logic.getDlPercentage(type);
    return Row(
      // mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Column(
          children: [
            Container(
                decoration: const BoxDecoration(
                    color: Colours.greyD9,
                    borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(2),
                        topRight: Radius.circular(2))),
                width: 41,
                height: 20,
                alignment: Alignment.center,
                child: QsText(type == 0 ? '主队' : '近', fontSize: 12)),
            Container(
                decoration: BoxDecoration(
                    borderRadius: const BorderRadius.only(
                        bottomLeft: Radius.circular(2),
                        bottomRight: Radius.circular(2)),
                    border: Border.all(width: 1, color: Colours.greyD9)),
                width: 41,
                height: 20,
                alignment: Alignment.center,
                child: QsText('$length场', fontSize: 12)),
          ],
        ),
        const SizedBox(width: 10),
        Column(
          children: [
            Row(
                crossAxisAlignment: CrossAxisAlignment.baseline,
                textBaseline: TextBaseline.alphabetic,
                children: [
                  QsText('胜率 ', fontSize: 12),
                  QsText(
                    '${winPercentage[0]}%',
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                    color: Colours.main,
                    fontFamily: 'Din',
                  ),
                ]),
            QsText(
              '${winPercentage[1]}胜${winPercentage[2]}负',
              fontSize: 10,
              color: Colours.grey99,
            ),
          ],
        ),
        const SizedBox(width: 10),
        Column(
          children: [
            Row(
                crossAxisAlignment: CrossAxisAlignment.baseline,
                textBaseline: TextBaseline.alphabetic,
                children: [
                  QsText('赢率 ', fontSize: 12),
                  QsText(
                    '${ahPercentage[0]}%',
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                    color: Colours.main,
                    fontFamily: 'Din',
                  ),
                ]),
            QsText(
              '${ahPercentage[1]}赢${ahPercentage[2]}走${ahPercentage[3]}输',
              fontSize: 10,
              color: Colours.grey99,
            ),
          ],
        ),
        const SizedBox(width: 10),
        Column(
          children: [
            Row(
                crossAxisAlignment: CrossAxisAlignment.baseline,
                textBaseline: TextBaseline.alphabetic,
                children: [
                  QsText('大率 ', fontSize: 12),
                  QsText(
                    '${sbPercentage[0]}%',
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                    color: Colours.main,
                    fontFamily: 'Din',
                  ),
                ]),
            QsText(
              '${sbPercentage[1]}大${sbPercentage[2]}走${sbPercentage[3]}小',
              fontSize: 10,
              color: Colours.grey99,
            ),
          ],
        ),
        const SizedBox(width: 10),
        Column(
          children: [
            Row(
                crossAxisAlignment: CrossAxisAlignment.baseline,
                textBaseline: TextBaseline.alphabetic,
                children: [
                  QsText('单率 ', fontSize: 12),
                  QsText(
                    '${dlPercentage[0]}%',
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                    color: Colours.main,
                    fontFamily: 'Din',
                  ),
                ]),
            QsText(
              '${dlPercentage[1]}单${dlPercentage[2]}双',
              fontSize: 10,
              color: Colours.grey99,
            ),
          ],
        ),
      ],
    );
  }

  Widget titleWidget(String title, String image) {
    return Container(
      color: Colours.white,
      padding: const EdgeInsets.only(left: 12, top: 16, bottom: 16),
      child: Row(
        children: [
          Image.asset(Utils.getImgPath(image), width: 24),
          const SizedBox(width: 2),
          QsText(title, fontWeight: FontWeight.w500, fontSize: 16),
        ],
      ),
    );
  }
}
